<template>
  <el-tag :type="tagType" size="small" :style="customStyle">
    {{ displayText }}
  </el-tag>
</template>

<script>
import { listPartType } from '@/api/dict/partType'

export default {
  name: "TypeTag",
  props: {
    value: {
      type: String,
      required: true
    },
    type: {
      type: String,
      required: true,
      validator: function (value) {
        return ['bizRefType', 'partType', 'txType', 'direction'].indexOf(value) !== -1
      }
    }
  },
  data() {
    return {
      partTypeOptions: [],
      loadingPartTypes: false
    }
  },
  computed: {
    displayText() {
      return this.getDisplayText(this.value, this.type)
    },
    tagType() {
      return this.getTagType(this.value, this.type)
    },
    customStyle() {
      // 为入库类型和出库类型设置不同的背景色和字体色
      if (this.type === 'bizRefType') {
        const styles = {
          'PURCHASE': { backgroundColor: '#e1f3d8', borderColor: '#e1f3d8', color: '#529b2e' },   // 采购入库 - 浅绿色背景，深绿色字体
          'TRANSFER': { backgroundColor: '#d9ecff', borderColor: '#d9ecff', color: '#409eff' },  // 调拨 - 浅蓝色背景，深蓝色字体
          'RETURN': { backgroundColor: '#f0f9eb', borderColor: '#f0f9eb', color: '#67c23a' },   // 退货入库 - 浅绿灰色背景，深绿色字体
          'CONSUME': { backgroundColor: '#fdf6ec', borderColor: '#fdf6ec', color: '#e6a23c' },  // 领用出库 - 浅橙色背景，深橙色字体
          'REPAIR': { backgroundColor: '#fef0f0', borderColor: '#fef0f0', color: '#f56c6c' },   // 维修出库 - 浅红色背景，深红色字体
          'OTHER': { backgroundColor: '#f4f4f5', borderColor: '#f4f4f5', color: '#909399' }     // 其他 - 浅灰色背景，深灰色字体
        };

        if (styles[this.value]) {
          return styles[this.value];
        }
      }
      return {};
    }
  },
  created() {
    if (this.type === 'partType') {
      // 检查父组件是否已经预加载了备件类型数据
      if (this.$parent && this.$parent.$partTypeOptions) {
        this.partTypeOptions = this.$parent.$partTypeOptions
        this.$partTypeLoaded = true
      } else {
        this.loadPartTypes()
      }
    }
  },
  methods: {
    // 加载备件类型数据
    loadPartTypes() {
      // 检查是否已经加载过或者正在加载
      if (this.$partTypeLoaded || this.loadingPartTypes) return
      this.loadingPartTypes = true
      listPartType({ pageNum: 1, pageSize: 9999, enabled: 1 }).then(response => {
        this.partTypeOptions = response.rows || response.data || []
        this.$partTypeLoaded = true
        this.loadingPartTypes = false
      }).catch(() => {
        this.partTypeOptions = []
        this.loadingPartTypes = false
      })
    },
    getDisplayText(value, type) {
      // 如果是备件类型，从动态数据中查找
      if (type === 'partType') {
        const option = this.partTypeOptions.find(item => item.code === value)
        return option ? option.name : value
      }

      // 其他类型使用静态映射
      const typeMaps = {
        bizRefType: {
          // 入库业务类型
          'PURCHASE': '采购入库',
          'TRANSFER': '调拨',
          'RETURN': '退货入库',
          'INVENTORY': '盘点入库',
          'INVENTORY_GAIN': '盘盈入库',
          // 出库业务类型
          'CONSUME': '领用出库',
          'REPAIR': '维修出库',
          'MAINTENANCE': '维护出库',
          'SCRAP': '报废出库',
          'OTHER': '其他',
          // 通用
          'INBOUND': '入库',
          'OUTBOUND': '出库'
        },
        txType: {
          // 通用入库/出库
          'INBOUND': '入库',
          'OUTBOUND': '出库',
          // 具体入库类型
          'PURCHASE': '入库',
          'RETURN': '入库',
          'INVENTORY': '入库',
          'INVENTORY_GAIN': '入库',
          // 具体出库类型
          'REPAIR': '出库',
          'TRANSFER': '出库',
          'MAINTENANCE': '出库',
          'SCRAP': '出库',
          'CONSUME': '出库',
          'OTHER': '出库'
        },
        direction: {
          // 标准方向
          'IN': '入库',
          'OUT': '出库',
          'INBOUND': '入库',
          'OUTBOUND': '出库',
          // 具体入库类型
          'PURCHASE': '入库',
          'RETURN': '入库',
          'INVENTORY': '入库',
          'INVENTORY_GAIN': '入库',
          // 具体出库类型
          'REPAIR': '出库',
          'TRANSFER': '出库',
          'MAINTENANCE': '出库',
          'SCRAP': '出库',
          'CONSUME': '出库',
          'OTHER': '出库'
        }
      }
      return typeMaps[type] && typeMaps[type][value] ? typeMaps[type][value] : value
    },
    getTagType(value, type) {
      if (type === 'txType' || type === 'direction') {
        // 定义入库类型列表
        const inboundTypes = ['INBOUND', 'IN', 'PURCHASE', 'RETURN', 'INVENTORY', 'INVENTORY_GAIN'];
        return inboundTypes.includes(value) ? 'success' : 'danger';
      }
      return 'info'
    }
  }
}
</script>
